var PrintReturnOrder = function () {
  var template = /* html */ `
    <div class="print-return-order" v-loading.fullscreen.lock="loading">
      <div style="height:40px;margin-bottom:10px">
        <el-button type="primary" size="small" @click="print">打印</el-button>
        <config-button v-if="tableColumns!==null" :config.sync="pageConfig" :table-columns="tableColumns">退货单设置</config-button>
      </div>
      <div class="print-return-order-div print-area" style="text-align:center" v-if="user!==null&&pageConfig.tableColumns!==undefined">
        <div class="print-return-order-content" :style="[pageSize]">
          <div ref="printArea">
            <div class="order-title" :style="[textSize.titleSize]">
              <span>{{user.company}}</span>
              <span>退货单</span>
            </div>
            <div class="table-head" :style="[textSize.otherSize]">
              <div>
                <span>往来单位：</span>
                <span>{{orderInfo.providerName}}</span></div>
              <div>
                <span>单据编号：</span>
                <input v-if="mode==='edit'" v-model="printOrderNo" style="width:12em;" :style="[textSize.otherSize]" maxlength="20"
                  placeholder="请输入单号">
                <span v-else>{{printOrderNo}}</span>
              </div>
              <div>
                <span>单据日期：</span>
                <el-date-picker v-if="mode==='edit'" class="order-date-picker" v-model="orderInfo.createTime" format="yyyy-MM-dd" value-format="timestamp" size="mini" 
                  :clearable="false" :editable="false" style="width:175px;"></el-date-picker>
                <span v-else v-else>{{moment(orderInfo.createTime).format('YYYY-MM-DD')}}</span>
              </div>
            </div>
            <div class="return-order-table-div">
              <table cellspacing="0" cellpadding="0" :style="[textSize.tableSize]">
                <colgroup>
                  <template v-for="tableColumn in pageConfig.tableColumns">
                    <col :key="'col_'+tableColumn.id" :style="{width:tableColumn.width+'px'}">
                  </template>
                </colgroup>
                <tr style="height:0">
                  <td :colspan="pageConfig.tableColumns.length">
                    <div class="return-order-remark">
                      <div>单据摘要：</div>
                      <div style="flex:1">
                        <show-textarea v-model="clauseContent" :autosize="true">
                        </show-textarea>
                      </div>
                    </div>
                  </td>
                </tr>
                <tr v-if="pageConfig.showTableHead">
                  <th v-for="tableColumn in pageConfig.tableColumns" :key="'head_'+tableColumn.id">
                    <span>{{tableColumn.label}}</span>
                    <div v-if="tableColumn.hasSort&&mode==='edit'" class="sort-caret" :class="[tableColumn.sortType]">
                      <div class="sort-index">{{getSortIndex(tableColumn)}}</div>
                      <i class="ascending" @click="toOrderData(tableColumn,'ascending')"></i>
                      <i class="descending" @click="toOrderData(tableColumn,'descending')"></i>
                    </div>
                  </th>
                </tr>

                <template v-for="(order,index) in printOrders">
                <tr :key="'oreder_'+index">
                  <template v-for="(tableColumn,colIndex) in pageConfig.tableColumns">
                    <td :key="'data_'+tableColumn.id">
                      <div v-if="!tableColumn.config.edit" style="height:100%;" :style="[getAlignStyle(tableColumn)]">
                        {{getTableData(order,tableColumn,index)}}
                      </div>
                      <div v-else>
                        <show-textarea class="orderTextarea" v-model="order[tableColumn.config.field]" :autosize="true">
                        </show-textarea>
                      </div>
                    </td>
                  </template>
                </tr>
                </template>
                
                <tr v-if="orderStat!==null">
                  <td v-for="(tableColumn,index) in pageConfig.tableColumns" :key="'stat_'+tableColumn.id">
                    <span v-if="index===0">合计</span>
                    <span v-else>{{orderStat[tableColumn.config.field]}}</span>
                  </td>
                </tr>
              </table>
            </div>

            <div class="print-return-order-floor">
              <div>制单人：{{user.userName}}</div>
              <div>电话：{{user.companyInfo.phone}}</div>
              <div style="display:flex">
                <div>接收人：</div>
                <div style="flex:1" contenteditable="true"></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  `;

  return {
    mixins: [printCommonOrderMixin('returnOrderList')],

    props: {
      orders: {
        type: Array,
        required: true
      }
    },

    data: function () {
      return {
        loading: false,
        templateOrderName: 'returnOrder',
        orderInfo: this.getOrderInfo(),
        returnOrderList: [],
        orderStat: null
      };
    },

    created: function () {
      var self = this;
      this.setTemplConfig().then(function (config) {
        self.setPrintId();
        self.initTemplConfig(config);
        self.initData();
      }).catch(function () {});
    },

    methods: {
      getOrderInfo: function () {
        var orders = this.orders;
        var order = orders[0];
        var orderInfo = {
          providerName: order.providerName,
          createTime: moment().valueOf()
        };

        return orderInfo;
      },

      initTemplConfig: function (config) {
        var clauseContent = config.clauseContent;
        if (SysUtil.isEmpty(clauseContent)) {
          clauseContent = '';
        }
        this.clauseContent = clauseContent;

        var columns = config.returnOrderColumns;
        CommonTemplateUtil.setColumnConfig(columns, "returnOrderColumns");
        this.tableColumns = columns;
      },

      initData: function () {
        var orders = this.orders;
        orders = _.cloneDeep(orders);
        for (var i = 0; i < orders.length; i++) {
          var order = orders[i];
          var returnMoney = order.inOutMoney;
          if (SysUtil.isEmpty(returnMoney)) {
            returnMoney = 0;
          }
          order.returnMoney = returnMoney;
        }
        this.returnOrderList = orders;
        this.orderStat = this.getOrderStat();
        this.sortData();
      },

      sortData: function () {
        var returnOrderList = this.returnOrderList;
        var tableColumns = this.tableColumns;
        var sortColumn = _.find(tableColumns, function (tableColumn) {
          return tableColumn.sortType !== undefined && tableColumn.sortType !== '';
        });
        var printOrders = _.clone(returnOrderList);
        if (sortColumn !== undefined) {
          var sortType = sortColumn.sortType;
          sortType = sortType === 'ascending' ? 'asc' : 'desc';
          var sortConfig = sortColumn.config;
          var sortField = sortConfig.sortField;
          if (sortField === undefined) {
            sortField = sortConfig.field;
          }
          printOrders = SysUtil.sortDataByField(printOrders, sortField, sortType);
        }
        this.printOrders = printOrders;
      },

      toOrderData: function (tableColumn, type) {
        var sortType = tableColumn.sortType;
        if (sortType !== '') {
          if (sortType === type) {
            tableColumn.sortType = '';
          } else {
            tableColumn.sortType = type;
          }
        } else {
          tableColumn.sortType = type;
          var tableColumns = this.tableColumns;
          for (var i = 0; i < tableColumns.length; i++) {
            var column = tableColumns[i];
            if (!column.hasSort || column === tableColumn) {
              continue;
            }

            if (column.sortType !== '') {
              column.sortType = '';
              break;
            }
          }
        }
        this.sortData();
      },

      getOrderStat: function () {
        var orders = this.returnOrderList;
        if (orders.length === 0) {
          return null;
        }

        var sumCount = 0,
          sumMoney = 0;
        for (var i = 0; i < orders.length; i++) {
          var order = orders[i];
          var count = order.count;
          if (SysUtil.isEmpty(count)) {
            count = 0;
          }
          sumCount += count;

          var returnMoney = order.returnMoney;
          if (SysUtil.isEmpty(returnMoney)) {
            returnMoney = 0;
          }
          sumMoney += returnMoney;
        }
        return {
          count: sumCount,
          returnMoney: sumMoney
        };
      },

      print: function () {
        if (this.printOrderNo === '') {
          this.$alert('请输入单据编号', '信息');
          return;
        }

        this.toPrintOrder('returnOrder');
      },

      tablePaging: function () {

      }
    },

    components: {
      ShowTextarea: ShowTextarea
    },

    template: template
  };
}();
